<li class="current">
	<article class="message">
		<div class="message-header">
		  <p>ionic</p>
		</div>
		<div class="message-body iconBox"></div>
	</article>
</li>
<li>
	IconContent内容3
</li>
<li>
	IconContent内容4
</li>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.4/jquery.min.js" integrity="sha512-pumBsjNRGGqkPzKHndZMaAG+bir374sORyzM3uulLV14lN5LyykqNk8eEeUlUkB3U0M4FApyaHraT65ihJhDpQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="public/json_data.json" type="text/javascript"></script>
<script type="text/javascript">
	$(function(){
		render(ionic);
	})
	function render(ionic){
		var html = ``;
		$.each(ionic,function(k,v){
			// console.log(v,'iiii')
			var str = `
				<h4 class="title is-5">${v.title}</h4>
				<div class="columns is-multiline">
			`
			$.each(v.arr,function(k2,v2){
				// console.log(v2,'jjj')
				str += `
					<div class="column is-size-6 is-6-mobile is-2-desktop is-3-tablet icon_copy" data-clipboard-text="${v2.fontClass}"  onclick="Copy_icon(event)">
						<ion-icon name="${v2.fontClass}" style="font-size:32px;"></ion-icon>
						<span class="fa-lg">&nbsp;&nbsp; ${v2.fontName}</span>
					</div>
				`;
			});
			html += str + `</div><hr/>`;
		})
		$('.iconBox').append(html);
	}
	
</script>


<!-- 复制粘贴 -->
<!-- <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.6/dist/clipboard.min.js" type="text/javascript"></script> -->
<script type="text/javascript">
	var icons = '';
	var clipboardJS = ''
	$(function(){
		icons = document.querySelectorAll('.iconBox .icon_copy');
		// console.log(icons);
		clipboardJS = new ClipboardJS(icons);
	});
	function Copy_icon(ev){
		// console.log(ev);
		ev.preventDefault();
		
		clipboardJS.on('success',function(e){
			// console.info('Action:', e.action);
			// console.info('Text:', e.text);
			// console.info('Trigger:', e.trigger);
			e.clearSelection();
			// alert(`${e.text} 复制成功！`);
			clipboardJS.destroy();
			clipboardJS = new ClipboardJS(icons);
			console.log(`${e.text} 复制成功！`)
		});
		clipboardJS.on('error', function(e) {
			// console.error('Action:', e.action);
			// console.error('Trigger:', e.trigger);
		});
	}
	
</script>
